/*

@description: 快运服务样式

@author: 赖赖

@update: 2021年9月3日17:51:30

 */


 // 全局参数
 @width:1200px;
 @color:rgb(34,38,50);
 @btcolor:rgb(198, 43, 37);
 @btfont-size:38px;

//主体
 main{

    // LWL快运服务
    .cpfw{
        height: 440px;
        background: url('https://www.jdl.cn/_nuxt/img/banner.58077df.png');
        background-size: cover;

        hgroup{//主体
            width: @width;
            margin: auto;
            display: flex;
            flex-direction:column;
            justify-content:center;

            h1{//标题1
                margin-top: 110px;
                font-size: 45px;
                color: rgb(250,250,250);
            }

            h2{//标题2
                width: 432px;
                margin-top: 30px;
                font-size: 16px;
                color: rgb(250,250,250);
                line-height: 2;
            }
        }
    }

    //服务优势
    .dcfw{
        background: url('https://www.jdl.cn/_nuxt/img/advantage-bg.3cd6b77.png');
        background-size: cover;

        hgroup{//标题
            h1{
                padding-top: 45px;
                margin-bottom: 15px;
                font-size: @btfont-size;
                text-align: center; 
            }
        }

        div{//内容
            width: @width;
            margin: auto;
            display: flex;
            justify-content: space-around;

            article{//单个内容
                width: 384px;
                height: 236px;
                background: rgb(250,250,250);
                margin-top: 25px;
                margin-bottom: 50px;
                display: flex;
                flex-direction: column;
                justify-content: center;
                align-items: center;

                img{
                    width: 80px;
                    height: 80px;
                    background-size: cover;
                }
                h3{
                    margin-bottom: 15px;
                    margin-top: 15PX;
                    font-size: 16px;
                }
                p{
                    padding: 0 66px;
                    font-size: 14px;
                    text-align: center;
                    line-height: 24px;
                }
            }
        }
    }

    //增值服务
    .zzfw{
        background: url('https://www.jdl.cn/_nuxt/img/accretion-bg.f22cc0a.png');
        background-size: cover;
        height: 500px;

        hgroup{//标题
            h1{
                padding-top: 45px;
                margin-bottom: 15px;
                font-size: @btfont-size;
                text-align: center; 
            }
            h2{
                color: rgb(102, 102, 102);
                margin-bottom: 15px;
                font-size: 15px;
                text-align: center; 
            }
        }

        div{//内容
            width: @width;
            margin: auto;
            display: flex;
            justify-content: space-around;

            article{//单个内容
                position: relative;
                
                .t1{
                    width: 362px;
                    background-size: cover;
                }
                .t2{
                    width: 362px;
                    height: 202px;
                    background-size: cover;
                }
                h3{
                    position: absolute;
                    left: 0;
                    top: 0;
                    padding-left: 25px;
                    font-size: 24px;
                    color: rgb(250,250,250);
                    line-height: 90px;
                }
            }
        }
    }

    //服务产品
    .fw{
        height: 440px;
        background: url('https://www.jdl.cn/_nuxt/img/services-entry-bg.29d3183.png');
        background-size:  cover;

        hgroup{//标题
            h1{
                color: rgb(255, 255, 255);
                padding-top: 45px;
                margin-bottom: 10px;
                font-size: @btfont-size;
                text-align: center; 
            }
            h2{
                color: rgb(216, 216, 216);
                font-size: 18px;
                text-align: center; 
            }
        }

       .tp{//图片
           width: @width;
           margin: auto;
           display: flex;
           justify-content: space-between;

           .t1{//图
               width: 588px;
               height: 240px;
               margin-top: 20px;
               background: url('https://www.jdl.cn/_nuxt/img/express-bg.368d120.png');
               background-size: cover;
               display: flex;
               flex-direction: column;
               justify-content: center;
               align-items: center;

               img{
                   width: 70px;
                   height: 70px;
                   background-size: cover;
               }

               h1{
                   color: rgb(220, 38, 27);
                   font-size: 26px;
               }

               .gd{//了解更多
                   width: 150px;
                   height: 36px;
                   text-align: center;
                   line-height: 36px;
                   color: rgb(250,250,250);
                   border: 1px solid rgb(250,250,250);
                   margin-top: 15px;
               }
           }

           .t2{//图
            width: 588px;
            height: 240px;
            margin-top: 20px;
            background: url('https://www.jdl.cn/_nuxt/img/transport-bg.db629d6.png');
            background-size: cover;
            display: flex;
            flex-direction: column;
            justify-content: center;
            align-items: center;

            img{
                width: 70px;
                height: 70px;
                background-size: cover;
            }

            h1{
                color: rgb(220, 38, 27);
                font-size: 26px;
            }

            .gd{//了解更多
                width: 150px;
                height: 36px;
                text-align: center;
                line-height: 36px;
                color: rgb(250,250,250);
                border: 1px solid rgb(250,250,250);
                margin-top: 15px;
            }
        }
        }
    }   
 }